<script setup lang="ts" name="login">
  import { ref } from "vue"
  import router from "@/router"
  import menuData from "@/assets/json/authMenuList.json"
  import { useRouterStore } from "@/store/modules/routerControl"
  import { useUserStore } from "@/store/modules/user"
  import { initDynamicRouter } from "@/router/modules/dynamicRouter"
  import { useKeepAliveStore } from "@/store/modules/keepAlive"

  const routerStore = useRouterStore()
  const userStore = useUserStore()
  const keepAliveStore = useKeepAliveStore()

  const formInline = ref({
    name: "",
    password: ""
  })
  const onSubmit = async () => {
    await userStore.setUserInfo(formInline.value.name)
    await routerStore.setInitMenu(menuData.data)
    await initDynamicRouter()
    await keepAliveStore.setKeepAliveName()
    await routerStore.setPath("/home")
    await router.push("/home")
  }
</script>

<template>
  <div>
    <el-form :inline="false" :model="formInline">
      <el-form-item label="名字">
        <el-input v-model="formInline.name" placeholder="名字" clearable />
      </el-form-item>
      <el-form-item label="密码">
        <el-input v-model="formInline.password" placeholder="密码" clearable />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">登录</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<style scoped lang="scss"></style>
